<script setup lang="ts">
import { useRouter } from "vue-router";
import { useUserStoreHook } from "@/store/modules/user.store";
// import noAccess from "@/assets/images/403.svg?component";

defineOptions({
  name: "403",
});

const router = useRouter();

function handleReLogin() {
  useUserStoreHook().clearSessionAndCache();
  router.push("/login");
}
</script>

<template>
  <div class="flex justify-center items-center h-[640px]">
    <img class="min-w-[23.4375rem] sm:w-150" src="@/assets/images/403.svg" alt="403" />
    <div class="ml-12">
      <p class="font-medium text-4xl mb-4! dark:text-white">403</p>
      <p class="mb-4! text-gray-500">抱歉，你无权访问该页面</p>
      <el-button type="primary" @click="router.push('/dashboard')">返回首页</el-button>
      <el-button type="primary" @click="handleReLogin()">重新登陆</el-button>
    </div>
  </div>
</template>
